<template>
  <div>
      <el-table
      :data="tableData"
      border
      :header-cell-style="biaotou_yangshi"
      style="width: 100%">
      <el-table-column
      v-for="(v, index) in table_Head"
      :key="index"
      :prop="v.field"
      :label="v.title"
      :min-width="130"
      :width="v.width"
      ref="thDom">

      <template slot-scope="scope">
          <el-input v-if="index != 2" v-model="scope.row[v.field]" />
          <el-select v-else v-model="scope.row.type" :placeholder="scope.row.type">
              <el-option
              v-for="item in options_tab"
              :key="item.value"
              :label="item.label"
              :value="item.value">
              </el-option>
          </el-select>
      </template>
  </el-table-column>
  <!-- <el-table-column label="字段类型" width="200">
      <template slot-scope="scope">
          <el-select v-model="scope.row.e" placeholder="请选择">
              <el-option
              v-for="item in options_tab"
              :key="item.value"
              :label="item.label"
              :value="item.value">
              </el-option>
          </el-select>
      </template>
  </el-table-column> -->
  <!-- <el-table-column label="操作" width="100">
      <template slot-scope="scope">
          <div class="delete_box" @click="del_tab_fun(scope.row, scope.$index)"><i class="el-icon-delete"></i></div>
      </template>
      
  </el-table-column> -->
  </el-table>
  </div>
</template>
<script>
export default {
  props: {
    tableData: {
      type: Array,
      default () {
        return []
      }
    },
    table_Head: {
      type: Array,
      default () {
        return []
      }
    },
    options_tab: {
      type: Array,
      default () {
        return []
      }
    }
  },
  data () {
    return {

    }
  },
  methods: {
    liebiao_yangshi () {
        return 'text-align:center;color:#333333;font-size:14px;'
    },
    biaotou_yangshi () {
        return 'text-align:center;background:#f1f6ff;color:#333333;font-size:14px'
    },
    del_tab_fun (msg,idx) {
      this.$emit('del_tab_fun',msg,idx)
    }
  }
}
</script>
<style lang="stylus">
    // .delete_box {
    //     display flex
    //     justify-content center
    //     cursor pointer
    // }

    
#table_content >>> .el-submenu__title {
  width: 1.571429rem;
  display: flex;
  justify-content: space-between;
}

#zsbox{
    margin-top -30px
    // margin-left 60px
}
#zsbox >>> .el-table__empty-block{
    width 680px 
}
</style>